<template>
  <div class="row h-full businessItemForm" style="overflow-y: auto">
    <a-collapse v-model="activeKey">
      <a-collapse-panel key="1" header="业务事项映射基础信息">
        <a-row class="m-b-md">
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">事项名称</label>
          </a-col>
          <a-col :span="8">
            <a-input :disabled=true
                     :value="BusinessItem.F_ITEM_NAME"/>
          </a-col>
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">事项编码</label>
          </a-col>
          <a-col :span="8">
            <a-input :disabled=true
                     :value="BusinessItem.F_ITEM_CODE"/>

          </a-col>
        </a-row>
        <a-row class="m-b-md">
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">业务名称</label>
          </a-col>
          <a-col :span="8">
            <a-input :disabled=true
                     :value="BusinessItem.F_BUSINESS_NAME"/>
          </a-col>
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">业务ID</label>
          </a-col>
          <a-col :span="8">
            <a-input :disabled=true
                     :value="BusinessItem.F_BUSINESS_ID"/>
          </a-col>
        </a-row>
      </a-collapse-panel>
      <a-collapse-panel key="2" header="材料映射信息">
        <a-row class="m-b-md">
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">材料分类名称</label>
          </a-col>
          <a-col :span="8">
            <a-input :disabled=true :value = "BusinessItem.CATEGORY_NAME" />
          </a-col>
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">业务材料目录</label>
          </a-col>
          <a-col :span="8">
            <a-select class="w-full" v-model="BusinessItem.F_MATERIAL_DIRECTORY_ID">
              <a-select-option v-for="directory in directoryList"
                               :key="directory.id" :value="directory.id">{{ directory.name }}
              </a-select-option>
            </a-select>
          </a-col>
        </a-row>
        <a-row class="m-b-md">
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">排序ID</label>
          </a-col>
          <a-col :span="8">
            <a-input :disabled=true
                     :value="BusinessItem.F_MATE_SORT_UUID"/>
          </a-col>
          <a-col :span="3" class="text-align-right">
            <label class="m-r-lg">事项材料</label>
          </a-col>
          <a-col :span="8">
            <a-select class="w-full"
                      v-model="BusinessItem.F_MATERIAL_NAME">
              <a-select-option v-for="item in InvestmentList"
                               :key="item.id"
                               :value="item.material_name" @click="investmentClick(item)">{{ item.material_name }}
              </a-select-option>
            </a-select>
          </a-col>
        </a-row>
      </a-collapse-panel>
    </a-collapse>

  </div>
</template>

<script>
import businessService from "@/api/businessService";
import dapProjectService from "@/api/dapProjectService";

export default {
  data() {
    return {
      activeKey: ['1', '2'],
      InvestmentList: [],
      BusinessItem: this.BusinessItemProps,
      categoryList: [],
      directoryList: [],
    }
  },
  computed:{
    dataMode:{
      get(){
        return  this.$store.getters.getDataMode;
      },
      set(){}
    }
  },
  methods: {
    getInvestmentMaterialByItemCode(itemCode) {
      /**
       * true为新数据
       * false为旧数据
       */
      if (this.dataMode) {
        businessService.getInvestmentMaterialByItemCodeSource(itemCode,'investment_three_new').then((d) => {
          this.InvestmentList = d;
          this.InvestmentList.forEach(item => {
            item.title = item.material_name;
            item.value = item.id;
          })
        })
      }else {
        businessService.getInvestmentMaterialByItemCodeSource(itemCode,'investment_three_old').then((d) => {
          this.InvestmentList = d;
          this.InvestmentList.forEach(item => {
            item.title = item.material_name;
            item.value = item.id;
          })
        })
      }
    },
    investmentClick(key) {
      console.log(key)
      this.BusinessItem.F_MATE_SORT_UUID = key.mate_sort_uuid;
      this.BusinessItem.F_MATERIAL_UUID = key.material_uuid;
      this.BusinessItem.F_IS_REQUIRED = key.is_required;
      this.BusinessItem.F_MATERIAL_TYPE = key.material_type;
      this.BusinessItem.F_MATERIAL_NAME = key.material_name;

    },
    getBusinessMaterialById(businessId) {
      return businessService.getBusinessMaterialById(businessId).then((d) => {
        console.log('获取到的材料目录列表======》', d)
        this.categoryList = d;
      })
    },
    async getDirectoryList(value) {
      let businessMaterial = await businessService.getBusinessMaterialDetail(value)
      this.directoryList = businessMaterial.children
    },
    editItemMaterialData: function () {
      debugger
      console.log(this.BusinessItem)
      let result = [];
      let index = this.BusinessItem.F_MATERIAL_UUID.indexOf(',');
      if (index >= 0) {
        this.BusinessItem.F_MATERIAL_UUID = this.BusinessItem.F_MATERIAL_UUID.slice(0, index)
      }
      let data = {
        id: this.BusinessItem.ID,
        item_code: this.BusinessItem.F_ITEM_CODE,
        businessItemMapId: this.BusinessItem.F_BUSINESS_ITEM_MAP_ID,
        materialCategoryId: this.BusinessItem.F_MATERIAL_CATEGORY_ID,
        source: this.BusinessItem.F_SOURCE,
        //   以下为编辑部分
        is_required: this.BusinessItem.F_IS_REQUIRED,
        material_type: this.BusinessItem.F_MATERIAL_TYPE,
        material_name: this.BusinessItem.F_MATERIAL_NAME,
        mate_sort_uuid: this.BusinessItem.F_MATE_SORT_UUID,
        material_uuid: this.BusinessItem.F_MATERIAL_UUID,
        materialDirectoryId: this.BusinessItem.F_MATERIAL_DIRECTORY_ID,
      }
      result.push(data)
      dapProjectService.saveBusinessItemMaterial(data).then((d) => {
        console.log(d)
      })
    }
  },
  props: ['BusinessItemProps'],
  watch: {
    activeKey(key) {
      console.log(key);
    },
    'BusinessItem.F_MATERIAL_CATEGORY_ID'(value) {
      console.log(value)
      this.BusinessItem.F_MATERIAL_DIRECTORY_ID = this.directoryList[0].id
    }
  },
  mounted() {
    this.getInvestmentMaterialByItemCode(this.BusinessItem.F_ITEM_CODE);
    this.getBusinessMaterialById(this.BusinessItem.F_BUSINESS_ID);
    this.getDirectoryList(this.BusinessItem.F_MATERIAL_CATEGORY_ID)
    this.Event.$on('_EDIT_ITEM_MATERIAL_DATA_', this.editItemMaterialData)
  }

}
</script>


<style scoped lang="less">

</style>